@function pxToRem($val) {
    @return $val/100 + rem;
}

/deep/.main_content {
    flex: 1;
    height: 100%;
    // background: #f5f5f5;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
    .scorll{
        flex: 1;
        height: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: scroll;
    }
    .scorll::-webkit-scrollbar {
        width: 6px;
    }
    /*滚动槽*/
    .scorll::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        border-radius: 10px;
    }
    /* 滚动条滑块 */
    .scorll::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
    }
    .content {
        width: 100%;
        .search {
            width: 100%;
            background-color: #fff;
            padding: 20px 20px 0;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            box-sizing: border-box;
            .list {
                display: flex;
                justify-content: flex-start;
                align-items: center;
                padding-bottom: 20px;
                margin-right: 20px;
            
                span{
                    width: 90px;
                }
            }
            &.searchBox{
                justify-content: space-between;
                align-items: center;
                .left{
                width: 50%;
                /deep/ .ivu-tabs-nav {
                    .ivu-tabs-tab{
                        padding-bottom: 19px !important;
                        box-sizing: border-box !important;
                    } 
                }
                /deep/ .ivu-tabs-bar{
                    width: 100%;
                    margin: 0 auto;
                    border: none;
                }
            }
            .right{
                margin-top: -19px;
            }
            }
        }
        .boxList{
            width:100%;
            background:#fff;
            padding:20px 2%;
            box-sizing: border-box;
            border-radius: 4px;
            margin-top: 10px;
            display: flex;
            height: 100%;
            justify-content: space-between;
            align-items: center;
            .item{
                width: pxToRem(160);
                height: pxToRem(110);
                background: #FCFDFF;
                display: flex;
                justify-content: space-between;
                align-items: center;
                border: 1px solid #FF0000;
                padding: pxToRem(30) pxToRem(10);
                box-sizing: border-box;
                cursor: pointer;
                &:hover {
                    transform: scale( 1.05);
                    transition: all 1s;
                    box-shadow: 0 4px 8px rgba(46,104,253,.12);
                }
                &.envRuleType{
                    background-color: rgba(0, 172, 251, 0.1);
                    color: #fff;
                }
                .left{
                    width: pxToRem(35);
                    height: pxToRem(35);
                    margin-right: pxToRem(10);
                    img{
                        display: block;
                        width: 100%;
                        height: 100%;
                    }
                }
                .right{
                    flex: 1;
                    .p{
                        width: pxToRem(80);
                        font-weight: 500;
                        letter-spacing: pxToRem(2);
                        font-size: pxToRem(14);
                        font-family: Microsoft YaHei;
                        font-weight: 400;
                        color: #6A6A6A;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        &:last-of-type{
                            display: flex;
                            justify-content: flex-start;
                            align-items: center;
                        }
                        .num{
                            font-size: pxToRem(24);
                        }
                    }
                }
                
            }
        }
        .tableBox{
            width:100%;
            background-color: #fff;
            padding: 20px;
            box-sizing: border-box;
            .isFixed{
                position:fixed;
                z-index:999;
            }
            .tableList{
                width: 100%;
                height: 100%;
                margin: auto;
            }
        }
        .searchall {
            width: 96%;
            margin: 0 auto;
            padding-top: 10px;
        }
        .down {
            width: 96%;
            margin: 0 auto;
            // padding-top: 20px;
            display: flex;
            justify-content: flex-start;
        }
    }
    .padding_left{
        padding-left: 15px;
    }
  }
